<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: admin
  Date: 2019/12/4
  Time: 15:25
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page import="com.example.association2.model.User" %>
<%@ page import="com.example.association2.model.Association" %>
<%@ page import="java.util.List" %>
<%@ page import="static java.lang.Integer.parseInt" %>

<%@ page import="com.example.association2.model.Messages" %>

<html lang="zh-CN">
<head>
    <%@include file="head.jsp" %>
    <script src="../static/js/jquery.min.js"></script>
    <style>
       /*.user{*/
       /*    width: 10%;*/
       /*    text-align: center;*/
       /*    border-width:1px;*/
       /*    border-style:solid;*/
       /*    font-size: 30px;*/
       /*}*/
       /* .content{*/
       /*     width: 90%;*/
       /*     text-align: center;*/
       /*     border-width:1px;*/
       /*     border-style:solid;*/
       /*     font-size: 30px;*/
       /* }*/
     </style>
</head>
<body class="nav-md">
<div class="container body">
    <div class="main_container">
        <!-- 引入bar -->
        <jsp:include page="sidebar.jsp"/>
        <jsp:include page="topbar.jsp"/>
        <!-- page content -->
        <div class="right_col" role="main">
            <div class="page-title">
                <div class="title_left">
                    <h3>${association.name}</h3>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <div class=" x_panel">
                        <div class="x_content">
                            <div class="row ">
                                <div class="col-md-12 col-sm-12 col-xs-12 text-center"><!--分类栏-->
                                    <ul class="nav nav-tabs nav-justified">
                                        <li role="presentation" class="${bar == 1  ? 'active':''}"><a href="/newassociation?associationId=${association.associationId}&bar=1">社团介绍</a></li>
                                        <li role="presentation"class="${bar == 2  ? 'active':''}"><a href="/newassociation?associationId=${association.associationId}&bar=2">留言板</a></li>
                                        <li role="presentation"class="${bar == 3  ? 'active':''}"><a href="/newassociation?associationId=${association.associationId}&bar=3">活动</a></li>
                                    </ul>

                                    <!--主要内容-->
                                    <c:choose>
                                        <c:when test="${bar==1}">
                                            <div class="x_content">

                                                <div class="bs-example" data-example-id="simple-jumbotron">
                                                    <div class="jumbotron">
                                                        <h1>Hello, world!</h1>
                                                        <p>${association.description}</p>
                                                    </div>
                                                </div>
                                            </div>
                                        </c:when>
                                        <c:when test="${bar==2}">
                                            <%--这里table展示以前的留言--%>
                                            <div >
                                                <div style="height:500px ;width: 1000px;float: left;overflow: auto;">
                                                    <table id="table1" style="margin: auto">
                                                        <thead>
                                                        <tr>
                                                            <td hidden="true"></td>
                                                            <td class="user">用户</td>
                                                            <td class="content">留言</td>
                                                        </tr>
                                                        <script>

                                                        </script>
                                                        <c:forEach var="data" items="${data}">
                                                            <tr>
                                                                <td hidden="true"></td>
                                                                <td class="user">${data.userId}</td>
                                                                <td class="content">${data.message}</td>
                                                            </tr>
                                                        </c:forEach>
                                                        </thead>

                                                        <tbody id="trlist">
                                                        <tr id="tr">
                                                            <td hidden="true"></td>
                                                            <td style="width: 90px;background-color: red;"></td>
                                                            <td style="width: 890px;background-color: green;"></td>
                                                        </tr>

                                                        </tbody>
                                                    </table>

                                                </div>
                                                <div style="height:500px ;width: 350px; background-color: #0b97c4 ;float: left;margin-left: 10px">
                                                    <div>
                                                        <input id="text1" type="text" style="position: center;margin-top: 10px;width: 340px;height: 440px" value="输入你想说的话">
                                                        <button id="btn1"  class="btn btn-success">提交留言</button>
                                                    </div>


                                                </div>
                                            </div>


                                        </c:when><%--bar2结束--%>

                                        <c:when test="${bar==3}">
                                            <h2>特色活动：${signatureActivity}</h2>
                                            <c:forEach items="${activityList}" var="activity">
                                            <div class="col-md-55">
                                                <div class="thumbnail">
                                                    <div class="image view view-first">
                                                        <img style="width: 100%; display: block;" src="../static/images/media.jpg" alt="活动图片">
                                                        <div class="mask">
                                                            <p style="vertical-align: inherit;font-family: 宋体">${activity.description}</p>
                                                        </div>
                                                    </div>
                                                    <div class="caption">
                                                        <a href="/activity?activityId=${activity.activityId}">
                                                        <p>${activity.title}</p>
                                                        </a>
                                                    </div>
                                                </div>
                                            </div>
                                            </c:forEach>
                                        </c:when>
                                    </c:choose>
                                    <!--主要内容/-->

                                </div><!--分类栏/-->

                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- /page content -->
<jsp:include page="footer.jsp"/>
</body>



<script>
    <%--用AJAX动态获得 留言--%>
    var bar11=${bar};

    $(document).ready(function(){
        // $("#table1").insertAfter
        $("#btn1").click(function(){
            var massage1 = $("#text1").val();
            $.post("/addmessage",
                {
                    bar:2,
                    associationId: ${association.associationId},
                    massage: massage1
                });
            console.log("执行last");



            alert("留言成功");
            location.replace(location.href);
            //location.replace(location.href);
        })
    })
</script>
</html>



//location.href="/newassociation?associationId= ${association.associationId}&bar=2";